@charset "UTF-8";
* {
  margin: 0;
  padding: 0; }

.msgpic {
  position: absolute;
  z-index: 2;
  left: 11%;
  top: 29%;
  width: 77%;
  height: 43%; }
  .msgpic img {
    width: 100%;
    height: 100%; }

.backgroundpic {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  left: 1px;
  top: 1px; }
  .backgroundpic img {
    width: 100%;
    height: 100%; }

.imgpic {
  position: absolute;
  z-index: 5;
  width: 36%;
  height: 36%;
  left: 30%;
  top: 32%; }
  .imgpic img {
    width: 100%;
    height: 100%; }

.penpic {
  width: 10%;
  z-index: 6;
  height: 35%;
  position: absolute;
  left: 60%;
  top: 33%; }
  .penpic img {
    width: 70%;
    height: 100%; }

.msgfont {
  color: red;
  z-index: 5;
  font-size: 25px;
  font-family: '微软雅黑';
  width: 30px;
  font-weight: bold;
  position: absolute;
  left: 41%;
  top: 40%;
  margin-top: -5px;
  margin-left: 5px; }

.msgfont2 {
  color: gray;
  z-index: 5;
  font-size: 18px;
  font-family: '微软雅黑';
  position: absolute;
  left: 42%;
  top: 75%; }

.msgfont3 {
  color: gray;
  z-index: 5;
  font-size: 13px;
  font-family: '微软雅黑';
  position: absolute;
  left: 39%;
  top: 86%; }

.fontmsg {
  position: absolute;
  color: black;
  z-index: 5;
  font-size: 20px;
  font-family: '微软雅黑';
  width: 400px;
  left: 4%;
  top: 50%; }

.fontmsg2 {
  z-index: 1;
  position: absolute;
  left: 40%;
  top: 10%; }
  .fontmsg2 p {
    display: flex;
    color: black;
    z-index: 5;
    font-size: 35px;
    font-family: '微软雅黑';
    font-weight: bolder; }

.backpic {
  position: absolute;
  width: 80%;
  z-index: 4;
  height: 30%;
  left: 10%;
  top: 60%; }
  .backpic img {
    width: 100%;
    height: 100%; }

.minpic {
  position: absolute;
  z-index: 1;
  width: 40px;
  height: 40px;
  left: 20%;
  top: 20%; }
  .minpic img {
    width: 40px;
    height: 40px; }

.minpic2 {
  position: absolute;
  z-index: 1;
  width: 40px;
  height: 40px;
  left: 20%;
  top: 35%; }
  .minpic2 img {
    width: 40px;
    height: 40px; }

.minpic3 {
  position: absolute;
  z-index: 1;
  width: 40px;
  height: 40px;
  left: 20%;
  top: 50%; }
  .minpic3 img {
    width: 40px;
    height: 40px; }

.msgbackground {
  position: absolute;
  color: black;
  z-index: 5;
  font-size: 20px;
  font-family: '微软雅黑';
  left: 30%;
  top: 50%; }

.backgroundpic3 {
  position: absolute;
  z-index: 1;
  width: 50%;
  height: 40%;
  left: 1%;
  top: 50%; }
  .backgroundpic3 img {
    width: 100%;
    height: 100%; }

.btn {
  z-index: 999;
  position: absolute;
  top: 70%;
  left: 80%;
  width: 30px; }
  .btn button {
    border: 0;
    background: 0;
    color: white;
    font-size: 30px;
    font-family: '微软雅黑';
    font-weight: bolder;
    z-index: 999; }

.thefont1 {
  color: gray;
  font-size: 15px;
  position: absolute;
  z-index: 66;
  font-weight: bolder;
  left: 40%;
  top: 21%; }

.thefont2 {
  color: gray;
  font-size: 15px;
  position: absolute;
  z-index: 66;
  font-weight: bolder;
  left: 40%;
  top: 36%; }

.thefont3 {
  color: gray;
  font-size: 15px;
  position: absolute;
  z-index: 66;
  font-weight: bolder;
  left: 40%;
  top: 51%; }

.the3font1 {
  position: absolute;
  z-index: 66;
  font-size: 25px;
  color: white;
  left: 40%;
  top: 20%; }

.the3font2 {
  position: absolute;
  z-index: 66;
  font-size: 20px;
  display: block;
  width: 300px;
  color: white;
  left: 10%;
  top: 30%; }

#scroller {
  height: 100%;
  background: none; }
  #scroller ul {
    height: 100%;
    margin: 0 auto;
    background: none; }
    #scroller ul li {
      height: 20px;
      font-size: 15px;
      font-family: '微软雅黑';
      line-height: 20px;
      width: 80%;
      border-radius: 10px;
      margin: 10px auto;
      text-align: center; }

#wrapper {
  background: none; }
